<%@ page language="java" contentType="text/html; charset=UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ page isELIgnored="false" %>
<%
	String path = request.getContextPath();
	String base = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path ;
	String basePath = base+"/";
	String indexbi = basePath + "indexBI.do?t="+Math.random()+"r="+Math.random();
%>
<!doctype html>
<html class="no-js">
<head>
<meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>宝雅智能</title>
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <script src="../js/jquery-3.3.1.js"></script>
    <script src="../js/mui.min.js"></script>
    <link href="../css/mui.min.css" rel="stylesheet" />
    <link href="../css/app.css" rel="stylesheet" />
    <script src="../js/vue_dev.js"></script>
    <script src="../js/md5.min.js"></script>
    <script type="text/javascript" charset="utf-8">
        mui.init();
    </script>
    <script src="../js/app.js"></script>
    <style>
        .mui-input-row label {
            width: 40%;
        }

        .mui-input-row label~input,
        .mui-input-row label~select,
        .mui-input-row label~textarea {
            width: 60%;
        }

        .mui-button-row button {
            width: 46%;
        }
    </style>
    
    <style type="text/css">
       #propForm{

             top: 10%;

             left: 10%;

             width: 20%;

             height: 30%;

		}
    </style>
</head>

<body>
    <header id="vhead" class="mui-bar mui-bar-nav">
        <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left">
        </a>
        <h1 class="mui-title" id="deviceTitle">{{nickname}}</h1>
    </header>
    <hr/>
    <hr/>
    <hr/>
    <hr/>
    <hr/>
    
    <div class="mui-input-group"><a style="color: red;">操作列表</a>
		<ul class="mui-table-view mui-grid-view mui-grid-9" id="commandFirst">
			<!-- <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3" style="width:20%;padding-left: 0px;">
                    <span class="mui-icon mui-icon-home smart-icon"></span>
                    <div class="mui-media-body" id="gobackhome1">开</div>
                </li>
				<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3" style="width:20%;padding-left: 0px;">
					<span class="mui-icon mui-icon-home smart-icon"></span>
					<div class="mui-media-body">关</div>
				</li>
				<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3" style="width:20%;padding-left: 0px;">
					<span class="mui-icon mui-icon-home smart-icon"></span>
					<div class="mui-media-body">设置密码</div>
				</li>
				<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3" style="width:20%;padding-left: 0px;">
					<span class="mui-icon mui-icon-home smart-icon"></span>
					<div class="mui-media-body">清除密码</div>
				</li> -->
		</ul>
	</div>
	
    <div id="vmain" class="mui-content">
        <!-- <div class="mui-input-group">
            <div class="mui-input-row">
                <label style="font-size: medium;color:#666666;">名称：</label>
                <input type="text" style="color:limegreen;" class="mui-input" v-model="curdevice.name" />
            </div>
        </div>
		<div class="mui-input-group">
			<div class="mui-input-row">
				<label style="font-size: medium;color:#666666;">设备状态：</label>
				<input type="text" :style="online?'color:limegreen':'color:red'" disabled="disabled" class="mui-input" :value="online?'在线':'离线'" />
			</div>
		</div> -->
        <div class="mui-button-row">
            <button v-on:click="saveset" class="mui-btn mui-btn-success">保存设置</button>
        </div>
        

    </div>
<script src="<%=request.getContextPath()%>/jquery/jquery.min.js"></script>
<script src="<%=request.getContextPath()%>/js/jquery-3.2.1.min.js"></script>
    <script type="text/javascript">
    var url=location.href;
	//var rs = decodeURI(url).toString()
	var strUrl = JSON.stringify(location.href);
	var strSplit = strUrl.split("&")
	var renterId = strSplit[0].split("\?")[1].split("=")[1]
	var roomId = strSplit[1].split("=")[1]
	var timestamp = strSplit[2].split("=")[1]
	var sign = strSplit[3].split("=")[1]
	var type = strSplit[4].split("=")[1].split("\"")[0];
	var verJumpUrl = "http://localhost"
	var verPort = "8765"
	var invokInfUrl = "/device/deviceControl"
	var backLoadUrl = verJumpUrl + ":" + verPort + invokInfUrl
	console.log(type)
	console.log(backLoadUrl)
	
    	$(function(){
    		$.ajax({//这个是ajax请求
                <%-- url:"<%=request.getContextPath()%>/wx/findRoomEquipmentByUser.do?roomNumber="+roomId, --%>
                url:"<%=request.getContextPath()%>/cotol/findEquipmentOperateByCode.do?dt="+type,
                 type:"POST",
                 success:function(data){
                     for(var i=0;i<data.data.length;i++){//data.length是获取data的长度。for循环
    				document.getElementById("deviceTitle").innerHTML=data.data[0].dna
                    	 //$("#first").append("<li>"+data.data[i].roomEquipment+"</li>");
                    	// <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3" style="width:20%;padding-left: 0px;">
                        // <span class="mui-icon mui-icon-home smart-icon"></span>
                        // <div class="mui-media-body" id="gobackhome1">回家</div>
                     	// </li>
                         $("#commandFirst").append("<li  class=\"mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3\" style=\"width:20%;padding-left: 0px;\">" +
                          "<span id=\""+data.data[i].id+"\" value=\""+data.data[i].dopena+"\" " +
                          "param1=\""+data.data[i].dopeto+"\" "+
                          "param2=\""+data.data[i].dtoken+"\" "+
                          "param3=\""+data.data[i].did+"\" "+
                          "param4=\""+data.data[i].dt+"\" "+
                          "param5=\""+data.data[i].dopet+"\" "+
                          "param6=\""+data.data[i].dpani+"\" "+
                          "param7=\""+data.data[i].dbuti+"\" "+
                          "param8=\""+data.data[i].dequpwd+"\" "+
                          "class=\"mui-icon mui-icon-home smart-icon\"></span>" +
                         "<div  class=\"mui-media-body\" >" +
                         data.data[i].dopena+"</div>"
                         +
                         //"<input type=\"radio\" name=\"radio\" value=\"1\">开"+
                         //"<input type=\"radio\" name=\"radio\" value=\"1\">关"+
                         //"<input type=\"radio\" name=\"radio\" value=\"1\">停"+
                         //abc(data.data[i].deviceId)+
                         "</li>"); //如果添加class或者id内容要加单引号例如：$("#first").append("<li class='a'>"+data[i].name+"</li>");
			    		 $(document).on("click", "#"+data.data[i].id, function(e) {
			    			//console.log($(this).attr('id'))
			    			//console.log("value="+$(this).attr('value'))
			    			//console.log(e.target)
			    			var params = {
			    				 "a" : $(this).attr('param1')
			    				,"b" : $(this).attr('param2')	
			    				,"c" : $(this).attr('param3')	
			    				,"d" : $(this).attr('param4')	
			    				,"e" : $(this).attr('param5')	
			    				,"f" : $(this).attr('param6')	
			    				,"g" : $(this).attr('param7')	
			    				,"h" : $(this).attr('param8')	
			    			};
			    			
			    			switch ($(this).attr('value')) {
				    			case  '设置密码' : doCommandEditPwd(params)
		    			 			break;
				    			default : 
					    			doAllControl(params)
			    			}
				    			
			    			/* switch ($(this).attr('value')) {
				    			 	case  '开锁' :  doCommandOpenLock($(this).attr('param2'))
				    			 		break;
				    			 	case  '关锁' : doCommandCloseLock($(this).attr('id'))
				    			 		break;
				    			 	case  '设置密码' : doCommandEditPwd($(this).attr('id'))
				    			 		break;
				    			 	case  '清除密码' : doCommandCleanPwd($(this).attr('id'))
				    			 		break;
				    			 	case  '开' : doCommandOpen(params)
				    			 		break;
				    			 	case  '关' : doCommandClose($(this).attr('param2'))
				    			 		break;
				    			 	case  '停' : doCommandStop($(this).attr('id'))
				    			 		break;
				    			 	case  '舒适' : doCommandComfort($(this).attr('id'))
				    			 		break;
				    			 	case  '强劲' : doCommandPowerful($(this).attr('id'))
				    			 		break;
				    			 	case  '28度' : doCommandTwentyEightDegree($(this).attr('id'))
				    			 		break;
				    			 	case  '一级风' : doCommandOneLevelAir($(this).attr('id'))
				    			 		break;
				    			 	case  '二级风' : doCommandTwoLevelAir($(this).attr('id'))
				    			 		break;
				    			 	case  '三级风' : doCommandThreeLevelAir($(this).attr('id'))
				    			 		break;
				    			 	case  '送风' : doCommandBlowAir($(this).attr('id'))
				    			 		break;
				    			 	case  '除湿' : doCommandArefaction($(this).attr('id'))
				    			 		break;
				    			 	case  '制冷' : doCommandRefrigeration($(this).attr('id'))
				    			 		break;
				    			 	case  '制热' : doCommandHeatHot($(this).attr('id'))
				    			 		break;
				    			 	case  '循环' : doCommandCirculation($(this).attr('id'))
				    			 		break;
				    			 } */
			    		 });
                     }
                 }
             });

    		function doAllControl(data){
    			console.log("doAllControl")
        		$.ajax({//这个是ajax请求
                    url:"<%=request.getContextPath()%>/cotol/handleRoom.do?a="+data.a+"&b="+data.b+"&c="+data.c+"&d="+data.d+"&e="+data.e+"&f="+data.f+"&g="+data.g+"&h="+data.h,
                     success:function(res){
    					if(res.state == 1) {
    						alert(res.message)
    					} else {
    						alert(res.message)
    					}                	 
                     }
                 });
    		}
		
    		function doCommandEditPwd(data){
	    			console.log("doCommandEditPwd")
	    			var btnArray = ['取消', '确认'];
					mui.prompt('请设置开锁密码：', '仅限6-10位数字', '设置密码', btnArray, function(e) {
					if (e.index == 1) {
						var isok = false;
						try {
							var pwd = parseInt(e.value);
							console.log(e.value.length);
							if (pwd >= 100000 && e.value.length < 11) {
								isok = true;
							}
						} catch (e) {
							isok = false;
						}
						if (isok) {
							mui.toast("保存成功");
							/* var jd = {};
							jd.method = "M013003";
							jd.token = vhead.device.token;
							jd.targetDevice = vhead.device.device_id;
							var pd = {};
							pd.password = e.value;
							jd.params = pd;
							ApiPost(ACT.controldevice, jd, function(rd) {
								console.log(rd);
								if (rd.data.sign) {
									mui.toast("保存成功");
								} else {
									ShowBadNetworkTip();
								}
							}); */
			    			var pams = {
			    				"a" : data.a
			    				,"b" : data.b
			    				,"c" : data.c
			    				,"d" : data.d
			    				,"e" : data.e
			    				,"f" : data.f
			    				,"g" : data.g
			    				,"h" : e.value
			    			}; 
			    			//console.log("h="+pams.h)
			    			$.ajax({//这个是ajax请求
			                    url:"<%=request.getContextPath()%>/cotol/setRooPwd.do?a="+pams.a+"&b="+pams.b+"&c="+pams.c+"&d="+pams.d+"&e="+pams.e+"&f="+pams.f+"&g="+pams.g+"&h="+pams.h,
		                     	success:function(res){
		    						if(res.state == 1) {
		    							mui.toast(res.message + ",密码保存成功");
		    						} else {
		    							alert("操作失败："+res.message)
		    							ShowBadNetworkTip();
		    						}                	 
		                    	 }
			                	});
			    			
						} else {
							mui.alert("密码仅限6-10位数字，请重新设置");
						}
					} else {
	
					}
				});
	    			
	    	}	
    		
    		/* function doCommandOpenLock(id){
    			console.log(id)
    		}
    		function doCommandCloseLock(id){
    			console.log(id)
    		}
    		function doCommandCleanPwd(id){
    			console.log(id)
    		}
    		
    		function doCommandOpen(id){
    			console.log(id)
    		}
    		function doCommandClose(id){
    			console.log(id)
    		}
    		function doCommandStop(id){
    			console.log(id)
    		}
    		
    		function doCommandComfort(id){
    			console.log(id)
    		}
    		function doCommandPowerful(id){
    			console.log(id)
    		}
    		function doCommandTwentyEightDegree(id){
    			console.log(id)
    		}
    		function doCommandOneLevelAir(id){
    			console.log(id)
    		}
    		function doCommandTwoLevelAir(id){
    			console.log(id)
    		}
    		function doCommandThreeLevelAir(id){
    			console.log(id)
    		}
    		function doCommandBlowAir(id){
    			console.log(id)
    		}
    		function doCommandArefaction(id){
    			console.log(id)
    		}
    		function doCommandRefrigeration(id){
    			console.log(id)
    		}
    		function doCommandHeatHot(id){
    			console.log(id)
    		}
    		function doCommandCirculation(id){
    			console.log(id)
    		} */
    		
    		
    		//两种方式实现div居中：1：用css方式：top：50%，left：50%； margin-let:-divwidth/2 margin-top:divheight/2; 2:用js实现：获取窗口的高宽，top=（屏幕高-div高）/2,为了随时的监听浏览器的改变，需要用到浏览器事件

    		//将div的位置封装在一个函数内部，直接调用
            
            
    		
    		/* function popShow(showId,backId){
    			document.getElementById(showId).style.display = 'block'
    			document.getElementById(backId).style.display = 'block'
    			
    			var backdiv = document.getElementById(backId)
    			backId.style.width = document.body.scrollWidth
    			$("#"+backId).height($(document).height())
    		}
    		function popHide(showId,backId){
    			document.getElementById(showId).style.display = 'none'
        		document.getElementById(backId).style.display = 'none'
        			
    		} */
    		
    		
    		
    		
    		
    		
    		
    		
    		$("#propshow").on("click",function(){
    			var btnArray = ['取消', '确认'];
				mui.prompt('请设置开锁密码：', '仅限6-10位数字', '设置密码', btnArray, function(e) {
					if (e.index == 1) {
						var isok = false;
						try {
							var pwd = parseInt(e.value);
							console.log(e.value.length);
							if (pwd >= 100000 && e.value.length < 11) {
								isok = true;
							}
						} catch (e) {
							isok = false;
						}
						if (isok) {
							mui.toast("保存成功");
							/* var jd = {};
							jd.method = "M013003";
							jd.token = vhead.device.token;
							jd.targetDevice = vhead.device.device_id;
							var pd = {};
							pd.password = e.value;
							jd.params = pd;
							ApiPost(ACT.controldevice, jd, function(rd) {
								console.log(rd);
								if (rd.data.sign) {
									mui.toast("保存成功");
								} else {
									ShowBadNetworkTip();
								}
							}); */
						} else {
							mui.alert("密码仅限6-10位数字，请重新设置");
						}
					} else {

					}
				});
    			
    		})
    		 //弹出一个输入框，输入一段文字，可以提交  
    		/*  function prom(){
    			 if (confirm("你确定提交吗？")) {  
    		            alert("点击了确定");  
    		        }  
    		        else {  
    		            alert("点击了取消");  
    		        }  
    		} */
   	 
        
    	})
    	
    </script>
</body>
</html>